<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>个人注册</title>
    <link rel="icon" href="https://static.nowcoder.com/images/logo_87_87.png">
    <link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/register.css">
  </head>
  <body>
    <nav class="navbar navbar-default">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand" href="https://www.nowcoder.com" target="_blank">牛客网</a>
        </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav">
            <li><a href="seckill.html">秒杀专区</a></li>
            <li class="active"><a href="javascript:void(0);">个人注册 <span class="sr-only">(current)</span></a></li>
            <li><a href="login.html">账户登录</a></li>
          </ul>
        </div>
      </div>
    </nav>

    <div class="container">
      <div class="row">
          <div class="col-sm-4"></div>
          <div class="col-sm-4">
            <form method="post" action="#">
                <div class="form-group">
                  <label for="phone">手机号</label>
                  <input type="text" class="form-control" id="phone" placeholder="请输入手机号">
                </div>
                <div class="form-group">
                    <label for="otp">验证码</label>
                    <div class=row>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="otp" placeholder="请输入验证码">
                        </div>
                        <div class="col-sm-4">
                            <button type="button" class="btn btn-primary" id="btn-otp">获取验证码</button>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="password">密码</label>
                    <input type="password" class="form-control" id="password" placeholder="请输入密码">
                </div>
                <div class="form-group">
                    <label for="password-confirm">确认密码</label>
                    <input type="password" class="form-control" id="password-confirm" placeholder="请确认密码">
                </div>
                <div class="form-group">
                    <label for="nickname">昵称</label>
                    <input type="text" class="form-control" id="nickname" placeholder="请输入昵称">
                </div>
                <div class="form-group">
                    <label for="gender">性别</label>
                    <select class="form-control" id="gender">
                        <option value="0">请选择性别</option>
                        <option value="1">男</option>
                        <option value="2">女</option>
                      </select>
                </div>
                <div class="form-group">
                    <label for="age">年龄</label>
                    <input type="number" class="form-control" id="age" placeholder="请输入年龄" min="1" max="200" >
                </div>
                <div class="form-group">
                    <button type="button" class="btn btn-block btn-primary" id="btn-register">立即注册</button>    
                </div>
              </form>              
          </div>
          <div class="col-sm-4"></div>
      </div>
    </div>

    <script src="./bootstrap/js/jquery-3.5.1.min.js"></script>
    <script src="./bootstrap/js/bootstrap.min.js"></script>
    <script src="./js/common.js"></script>
    <script src="./js/register.js"></script>
  </body>
</html>